<template>
  <PhoneShow :formList="formLists" :formConf="formAttrs" />
</template>

<script>
import PhoneShow from "@/components/formGenerator/formComponents/phoneShow.vue";
import { deepClone, setFormValue } from "@/components/formGenerator/utils";
import "./common/initPhone";

export default {
  name: "FGPhoneShow",
  components: {
    PhoneShow,
  },
  props: {
    value: {
      type: String,
      default: "",
    },
    // 传入对应的key & value
    form: {
      type: Object,
      default: () => {},
    },
  },
  computed: {
    formLists() {
      const obj = JSON.parse(this.value || "{}");
      if (obj && obj.list) {
        return setFormValue(deepClone(obj.list || []), this.form);
      }
      return [];
    },
    formAttrs() {
      const obj = JSON.parse(this.value || "{}");
      if (obj && obj.list) {
        return deepClone(obj);
      }
      return {};
    },
  },
};
</script>

<style lang="scss" scoped></style>
